/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-3dpdk0jyon] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-3dpdk0jyon] {
    flex: 1;
    /* Flex items won't shrink below their content by default, so one wide child
       (the chore week grid) used to drag the whole page sideways, nav and all.
       With this the page stays put and the grid scrolls inside its own wrapper. */
    min-width: 0;
}

.sidebar[b-3dpdk0jyon] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-3dpdk0jyon] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-3dpdk0jyon]  a, .top-row[b-3dpdk0jyon]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-3dpdk0jyon]  a:hover, .top-row[b-3dpdk0jyon]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-3dpdk0jyon]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* The account menu's items are links too, so undo the spacing and hover
       underline the top row puts on its own links. */
    .top-row[b-3dpdk0jyon]  .dropdown-menu a {
        margin-left: 0;
    }

    .top-row[b-3dpdk0jyon]  .dropdown-menu a:hover {
        text-decoration: none;
    }

    .top-row[b-3dpdk0jyon]  .account-toggle {
        font-size: 1.35rem;
        line-height: 1;
        padding: 0.25rem 0.5rem;
        color: var(--bs-body-color, #212529);
    }

@media (max-width: 640.98px) {
    /* Stays flex-end (from the base rule): the account icon is the row's only
       control now, and left-aligning it put its right-anchored menu off-screen. */
    .top-row[b-3dpdk0jyon]  a, .top-row[b-3dpdk0jyon]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-3dpdk0jyon] {
        flex-direction: row;
    }

    .sidebar[b-3dpdk0jyon] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-3dpdk0jyon] {
        position: sticky;
        top: 0;
        /* Above page content that stacks -- the chore grid's sticky kid column
           would otherwise paint over the open account menu. */
        z-index: 1030;
    }

    .top-row.auth[b-3dpdk0jyon]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-3dpdk0jyon], article[b-3dpdk0jyon] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-3dpdk0jyon] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    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-3dpdk0jyon] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-4dy8k32nbh] {
    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.1);
    background: 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.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-4dy8k32nbh] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-4dy8k32nbh] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-4dy8k32nbh] {
    font-size: 1.1rem;
}

.bi[b-4dy8k32nbh] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-4dy8k32nbh] {
    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-4dy8k32nbh] {
    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-4dy8k32nbh] {
    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");
}

.nav-item[b-4dy8k32nbh] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-4dy8k32nbh] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-4dy8k32nbh] {
        padding-bottom: 1rem;
    }

    .nav-item[b-4dy8k32nbh]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-4dy8k32nbh]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-4dy8k32nbh]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-4dy8k32nbh] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-4dy8k32nbh] {
    display: flex;
    flex-direction: column;
}

.app-version[b-4dy8k32nbh] {
    /* Pin to the very bottom of the sidebar, centered. */
    margin-top: auto;
    padding: 0.75rem 1rem;
    text-align: center;
    font-size: 0.8rem;
    color: rgba(215, 215, 215, 0.55);
}

@media (min-width: 641px) {
    .navbar-toggler[b-4dy8k32nbh] {
        display: none;
    }

    .nav-scrollable[b-4dy8k32nbh] {
        /* Never collapse the sidebar for wide screens */
        display: flex;
        flex-direction: column;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/PushRegistration.razor.rz.scp.css */
/* Sits above the content rather than pushing it around, so a nudge that appears a
   beat after load doesn't shove the page out from under a thumb mid-tap. */
.push-nudge[b-eoo0x483oy] {
    position: fixed;
    z-index: 1055;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    margin-inline: auto;
    max-width: 30rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 0.75rem;
    background-color: #fff;
    /* Keep clear of the iPhone home indicator when installed. */
    margin-bottom: env(safe-area-inset-bottom, 0);
}

.push-nudge-body[b-eoo0x483oy] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.push-nudge-icon[b-eoo0x483oy] {
    flex: 0 0 auto;
    margin-top: 0.15rem;
    font-size: 1.25rem;
    color: #1b6ec2;
}

.push-nudge-actions[b-eoo0x483oy] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.75rem;
}
/* /Components/Login.razor.rz.scp.css */
.login-container[b-va5b4pxo8v] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    min-height: 100vh;
    padding-top: 50px;
}

.login-box[b-va5b4pxo8v] {
    width: 350px;
    padding: 30px;
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

    .login-box h2[b-va5b4pxo8v] {
        text-align: center;
        margin-bottom: 25px;
        color: #333;
    }

.form-group[b-va5b4pxo8v] {
    margin-bottom: 20px;
}

    .form-group label[b-va5b4pxo8v] {
        display: block;
        margin-bottom: 5px;
        color: #555;
    }

.form-control[b-va5b4pxo8v] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-sizing: border-box;
}

.btn-primary[b-va5b4pxo8v] {
    width: 100%;
    padding: 10px 15px;
    background-color: #007bff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

    .btn-primary:hover[b-va5b4pxo8v] {
        background-color: #0056b3;
    }

.error-message[b-va5b4pxo8v] {
    color: red;
    margin-top: 10px;
    text-align: center;
}

.button-stack[b-va5b4pxo8v] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 10px;
}

.btn-link[b-va5b4pxo8v] {
    background: none;
    border: none;
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
    font-size: 0.9em;
}

.spinner[b-va5b4pxo8v] {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin-b-va5b4pxo8v 1s linear infinite;
    margin: 10px auto;
}

@keyframes spin-b-va5b4pxo8v {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* /Components/Pages/Areas/ManageAreas.razor.rz.scp.css */
/* Vertical kid cards instead of columns: six kids never fit across a phone, and
   the Sunday rotation is done thumb-first. */
.kid-card-list[b-ky30ox521q] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.kid-card[b-ky30ox521q] {
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    padding: 0.5rem 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.kid-card.unassigned[b-ky30ox521q] {
    border-style: dashed;
}

.kid-card.target[b-ky30ox521q] {
    background: #d1e7dd;
    cursor: pointer;
}

.kid-card-name[b-ky30ox521q] {
    flex: 0 0 5.5rem;
    font-weight: 600;
    font-size: 0.9rem;
}

.kid-card-chips[b-ky30ox521q] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.area-chip[b-ky30ox521q] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 999px;
    background: var(--bs-body-bg, #fff);
    font-size: 0.78rem;
    padding: 0.2rem 0.6rem;
    line-height: 1.2;
}

.area-chip.selected[b-ky30ox521q] {
    border-color: var(--bs-primary, #0d6efd);
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.35);
    background: #e7f1ff;
}

.area-chip .chip-edit[b-ky30ox521q] {
    font-size: 0.7rem;
    color: var(--bs-secondary-color);
}
/* /Components/Pages/Checks/AddChecks.razor.rz.scp.css */
/* Kids write as much as they like; the grid stays a grid. Full text is in the
   title attribute and on the kid's own card. */
.check-details[b-vpl9wwd1vb] {
    font-size: 0.7rem;
    line-height: 1.1;
    max-width: 9rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Scheduled chores, not the kid's words -- roman rather than italic, since in this
   slot the typeface is the only thing telling a parent "she says she did this" apart
   from "this was assigned to her". Given a third line because three or four chores a
   day is normal and a phone has no hover to recover the clipped tail. */
.check-details.chore-preview[b-vpl9wwd1vb] {
    -webkit-line-clamp: 3;
}

/* The parent's own reason for a denial, on a button because tapping it reopens the
   modal to reword it. btn-link would underline it, which on two clamped lines of prose
   reads as a broken link rather than editable text. */
.check-details.deny-reason[b-vpl9wwd1vb] {
    text-align: left;
    text-decoration: none;
}
/* /Components/Pages/Checks/ViewChecks.razor.rz.scp.css */
.calendar-container[b-0yjrr2afgp] {
    overflow-x: auto;
    max-width: 100%;
}

.calendar[b-0yjrr2afgp] {
    width: 100%;
    border-collapse: collapse;
}

    .calendar th[b-0yjrr2afgp], .calendar td[b-0yjrr2afgp] {
        border: 1px solid #ccc;
        text-align: left;
        vertical-align: top;
        padding: 10px;
        min-width: 50px;
    }

.inner-calendar[b-0yjrr2afgp] {
    width: 100%;
    border-collapse: collapse;
}

    .inner-calendar td[b-0yjrr2afgp] {
        border: none;
    }

.date-number[b-0yjrr2afgp] {
    font-weight: bold;
    text-align: center;
    padding: 5px;
}

.hasAllChecks[b-0yjrr2afgp] {
    background-color: #a0e7a0;
    font-weight: bold;
}

.checklist[b-0yjrr2afgp] {
    text-align: center;
}

.check-green[b-0yjrr2afgp] {
    color: green;
    font-weight: bold;
}

.x-red[b-0yjrr2afgp] {
    color: red;
    font-weight: bold;
}

@media (max-width: 600px) {
    .calendar th[b-0yjrr2afgp], .calendar td[b-0yjrr2afgp] {
        padding: 5px;
        font-size: 12px;
        min-width: 40px;
    }

    .checklist div[b-0yjrr2afgp] {
        font-size: 10px;
    }

    .date-number[b-0yjrr2afgp] {
        font-size: 14px;
        padding: 3px;
    }
}
/* /Components/Pages/Chores/ChoreAssignments.razor.rz.scp.css */
/* ---- Which layout is in force ----------------------------------------------
   Two things can ask for day view: the Day/Week toggle, and a phone, where week
   view isn't offered at all -- seven columns on a 390px screen clip every chore
   name to "Vacu...". So the switch below is the only thing written twice; every
   rule past this point reads these variables and appears once.

   Note the two only ever agree, never conflict: both force day view, nothing
   forces week view, so .day-view winning on specificity inside the media query
   is harmless. */
.chore-week[b-vfsoxqdj59] {
    --cols: minmax(72px, auto) repeat(7, minmax(132px, 1fr));
    --grid-min-width: 1000px;
    --grid-max-width: none;
    --week-chrome: block;
    --off-day: flex;
    --strip: none;
    --day-hint: none;
    --kid-font: 0.85rem;
    --chip-font: 0.72rem;
}

.chore-week.day-view[b-vfsoxqdj59] {
    /* Fixed, not minmax: a flexible max here grows to its limit before the 1fr
       column gets anything, which on a phone ate 144px of 375 for six-letter
       names. The chores are what need the width. */
    --cols: 5.5rem minmax(0, 1fr);
    --grid-min-width: 0;
    /* Left to fill a 1400px window, one day's chips stretch to ~1076px and park
       their weight badge a thousand pixels from the name it belongs to. Capped to
       a list, and to roughly the day strip's width so the two read as one block.
       Inert on a phone, which is narrower than the cap either way. */
    --grid-max-width: 40rem;
    --week-chrome: none;
    --off-day: none;
    --strip: flex;
    --day-hint: inline;
    --kid-font: 0.95rem;
    --chip-font: 0.85rem;
}

@media (max-width: 640.98px) {
    /* Same switch, forced -- keep in step with .day-view above. */
    .chore-week[b-vfsoxqdj59] {
        --cols: 5.5rem minmax(0, 1fr);
        --grid-min-width: 0;
        --grid-max-width: 40rem;
        --week-chrome: none;
        --off-day: none;
        --strip: flex;
        --day-hint: inline;
        --kid-font: 0.95rem;
        --chip-font: 0.85rem;
    }

    /* No toggle on a phone: day view is the only thing that fits. */
    .view-toggle[b-vfsoxqdj59] {
        display: none;
    }
}

/* ---- The grid --------------------------------------------------------------
   In week view this scrolls sideways below ~1300px and the kid-name column stays
   put so you always know whose row you're looking at. In day view it collapses
   to two columns and nothing overflows, so overflow-x: auto simply never fires. */
.week-grid-wrapper[b-vfsoxqdj59] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* The 132px floor is where a wrapped name still lands in three lines or fewer --
   below it the weight badge and icon leave so little room that chips stack into
   tall slivers. Past that point the wrapper scrolls instead of crushing. */
.week-grid[b-vfsoxqdj59] {
    display: grid;
    grid-template-columns: var(--cols);
    min-width: var(--grid-min-width);
    max-width: var(--grid-max-width);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
}

.grid-corner[b-vfsoxqdj59],
.grid-day-header[b-vfsoxqdj59],
.grid-kid-name[b-vfsoxqdj59] {
    background: var(--bs-tertiary-bg, #f8f9fa);
}

/* Day view hides the header row outright -- the day strip already names the day. */
.grid-corner[b-vfsoxqdj59],
.grid-day-header[b-vfsoxqdj59] {
    display: var(--week-chrome);
}

.grid-day-header[b-vfsoxqdj59] {
    text-align: center;
    font-weight: 600;
    padding: 0.35rem 0.25rem;
    border-bottom: 1px solid var(--bs-border-color);
    border-left: 1px solid var(--bs-border-color);
    font-size: 0.85rem;
}

.grid-day-header .day-number[b-vfsoxqdj59] {
    font-weight: 400;
    font-size: 0.7rem;
    color: var(--bs-secondary-color);
}

.grid-day-header.today[b-vfsoxqdj59] {
    background: #e7f1ff;
}

.grid-kid-name[b-vfsoxqdj59] {
    position: sticky;
    left: 0;
    z-index: 2;
    font-weight: 600;
    font-size: var(--kid-font);
    padding: 0.5em;
    border-top: 1px solid var(--bs-border-color);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.kid-week-weight[b-vfsoxqdj59] {
    font-weight: 400;
    font-size: 0.82em;
    color: var(--bs-secondary-color);
}

.grid-cell[b-vfsoxqdj59] {
    border-top: 1px solid var(--bs-border-color);
    border-left: 1px solid var(--bs-border-color);
    padding: 0.3rem;
    min-height: 2.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    align-items: stretch;
}

/* The six days day view isn't showing. They stay in the DOM -- display: none
   takes them out of grid placement, so the rest flows into two columns on its
   own and there's no second copy of this markup to keep in sync. */
.grid-cell.off-day[b-vfsoxqdj59] {
    display: var(--off-day);
}

/* Weekends are mostly empty (daily chores only) — keep them quiet. */
.grid-cell.weekend[b-vfsoxqdj59],
.grid-day-header.weekend[b-vfsoxqdj59] {
    background: var(--bs-secondary-bg, #e9ecef);
    opacity: 0.85;
}

.grid-cell.today[b-vfsoxqdj59] {
    background: #f2f8ff;
}

.grid-kid-name.my-row[b-vfsoxqdj59] {
    background: #fff3cd;
}

.grid-cell.my-row[b-vfsoxqdj59] {
    background: #fffbee;
}

/* Move-target tints while a chip is selected: green = the generator would allow
   this kid, amber = parent override territory. Both accept the tap. */
.grid-cell.target-ok[b-vfsoxqdj59] {
    background: #d1e7dd;
    cursor: pointer;
}

.grid-cell.target-warn[b-vfsoxqdj59] {
    background: #fff3cd;
    cursor: pointer;
}

/* ---- Chips ----------------------------------------------------------------
   Sized in em off --chip-font so day view's roomier text carries its padding and
   badges with it, instead of needing a variable per measurement.

   The whole chip is one button. What the tap means is the page's mode, not a
   control inside the chip -- a second button per chip would halve the target on
   the phone-sized cells that need it most. */
.chore-chip[b-vfsoxqdj59] {
    display: flex;
    align-items: center;
    gap: 0.35em;
    border: 1px solid var(--bs-border-color);
    border-radius: 999px;
    background: var(--bs-body-bg, #fff);
    font-size: var(--chip-font);
    padding: 0.25em 0.6em;
    text-align: left;
    line-height: 1.2;
    max-width: 100%;
}

/* ---- The done tick --------------------------------------------------------
   State, not a control: an empty circle where the chip is tickable, a filled
   green check once it is. Same slot either way, so a ticked chip doesn't reflow. */
.chore-chip .chip-check[b-vfsoxqdj59] {
    flex: 0 0 auto;
    font-size: 1.05em;
    line-height: 1;
    color: var(--bs-secondary-color);
}

.chore-chip.done .chip-check[b-vfsoxqdj59] {
    color: var(--bs-success, #198754);
}

/* Sized in em so it occupies the same slot the circle it replaces did -- a spinner
   at Bootstrap's own scale would shove the chore name sideways mid-save. */
.chore-chip .chip-spinner[b-vfsoxqdj59] {
    flex: 0 0 auto;
    width: 1.05em;
    height: 1.05em;
    border-width: 0.15em;
    color: var(--bs-secondary-color);
}

/* Still legible while it saves -- the chip isn't disabled because anything is wrong
   with it, only because the answer hasn't come back yet. */
.chore-chip:disabled[b-vfsoxqdj59] {
    opacity: 1;
    cursor: progress;
}

/* Struck through rather than faded away: the kid still wants to see what they
   did, and a parent scanning the row wants the same. */
.chore-chip.done .chip-name[b-vfsoxqdj59] {
    text-decoration: line-through;
    color: var(--bs-secondary-color);
}

/* Half of a dependency pair, and a chore tied to its day. Both muted like the pin --
   they're properties of the chore, not warnings; the title spells out which day or
   which partner. A chore can carry both badges at once. */
.chore-chip .chip-link[b-vfsoxqdj59],
.chore-chip .chip-day[b-vfsoxqdj59] {
    flex: 0 0 auto;
    font-size: 1em;
    color: var(--bs-secondary-color);
}

.chore-chip .chip-day[b-vfsoxqdj59] {
    font-size: 0.9em;
}

/* Names wrap rather than truncate, at every width. Fitting "Vacuum downstairs
   common area" on one line needs a ~220px column -- seven of those plus the nav
   sidebar wants a 1900px window, so an ellipsis here wasn't a narrow-screen
   compromise, it was the normal case. Two lines costs ~55px of grid height and
   nothing is left unreadable. */
.chore-chip .chip-name[b-vfsoxqdj59] {
    flex: 1 1 auto;
    overflow-wrap: break-word;
}

.chore-chip .chip-weight[b-vfsoxqdj59] {
    flex: 0 0 auto;
    background: var(--bs-secondary-bg, #e9ecef);
    border-radius: 999px;
    padding: 0 0.35em;
    font-weight: 600;
    font-size: 0.9em;
}

/* A chip whose tap does nothing for this viewer -- in move mode one they can't
   pick up, otherwise one they can't tick off. Faded rather than just cursor:default
   so the difference is visible on a touchscreen, which has no cursor to read. */
.chore-chip.locked[b-vfsoxqdj59] {
    cursor: default;
    opacity: 0.7;
}

.chore-chip.selected[b-vfsoxqdj59] {
    border-color: var(--bs-primary, #0d6efd);
    box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.35);
    background: #e7f1ff;
}

/* With a chore picked up the whole square is one drop target, so the chips
   sitting in it fade back instead of reading as separate buttons. The tints are
   lighter than the default border, which would wash the grid lines out into one
   block of colour -- darken them so you can still tell the squares apart. */
.week-grid.move-mode .grid-cell[b-vfsoxqdj59] {
    cursor: pointer;
    border-color: rgba(0, 0, 0, 0.2);
}

.week-grid.move-mode .grid-kid-name[b-vfsoxqdj59] {
    border-top-color: rgba(0, 0, 0, 0.2);
}

.week-grid.move-mode .chore-chip:not(.selected)[b-vfsoxqdj59] {
    opacity: 0.4;
}

/* The per-cell add affordance stays subtle until you look for it. */
.cell-add[b-vfsoxqdj59] {
    border: 1px dashed var(--bs-border-color);
    border-radius: 0.25rem;
    background: transparent;
    color: var(--bs-secondary-color);
    font-size: var(--chip-font);
    line-height: 1;
    padding: 0.35em;
    opacity: 0.5;
}

.cell-add:hover[b-vfsoxqdj59],
.cell-add:focus[b-vfsoxqdj59] {
    opacity: 1;
}

/* ---- Day strip ------------------------------------------------------------
   Capped rather than stretched: seven pills spread across a 1200px desktop read
   as a toolbar, not a set of days. The cap is above any phone width, so it has
   no effect there. */
.day-strip[b-vfsoxqdj59] {
    display: var(--strip);
    gap: 0.2rem;
    margin-bottom: 0.5rem;
    max-width: 34rem;
}

.day-view-hint[b-vfsoxqdj59] {
    display: var(--day-hint);
}

.day-pill[b-vfsoxqdj59] {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.05rem;
    padding: 0.35rem 0.1rem 0.3rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 0.375rem;
    background: var(--bs-body-bg, #fff);
    line-height: 1.1;
}

.day-pill .pill-dow[b-vfsoxqdj59] {
    font-size: 0.75rem;
    font-weight: 600;
}

.day-pill .pill-date[b-vfsoxqdj59] {
    font-size: 0.8rem;
    color: var(--bs-secondary-color);
}

.day-pill.weekend[b-vfsoxqdj59] {
    background: var(--bs-secondary-bg, #e9ecef);
}

/* Days the held chore can't move to -- for a kid, anything already past. Still
   tappable, since it only changes which day is on screen. */
.day-pill.unavailable[b-vfsoxqdj59] {
    opacity: 0.45;
}

.day-pill.today .pill-dow[b-vfsoxqdj59] {
    color: var(--bs-primary, #0d6efd);
}

.day-pill.active[b-vfsoxqdj59] {
    border-color: var(--bs-primary, #0d6efd);
    background: #e7f1ff;
    box-shadow: inset 0 0 0 1px var(--bs-primary, #0d6efd);
}

/* Which of the other six days have anything on them. */
.day-pill .pill-dot[b-vfsoxqdj59] {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--bs-secondary-color);
}

.day-pill.active .pill-dot[b-vfsoxqdj59] {
    background: var(--bs-primary, #0d6efd);
}
/* /Components/Pages/Pool/PoolHistory.razor.rz.scp.css */
/* One <tbody> per reading (its data row + optional note row). Stripe by
   group so a note always shares its reading's shade and reads as one unit,
   instead of picking up the next zebra stripe and looking detached. */
tbody:nth-of-type(odd) > tr > *[b-7p5dut5tfh] {
    --bs-table-accent-bg: var(--bs-table-striped-bg);
}

/* Merge a reading row into its note: drop the divider between them and let
   the note hug the values above, indented to read as subordinate. */
.has-note > *[b-7p5dut5tfh] {
    border-bottom: 0;
}

.note-cell[b-7p5dut5tfh] {
    padding-top: 0;
    padding-left: 1.5rem;
}
