/* cards.css - wydzielone style aplikacji. */

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.5rem), 1fr));
    gap: var(--grid-gap);
}

.stat-tile {
    display: grid;
    min-height: var(--stat-tile-min-height);
    align-content: space-between;
    gap: var(--space-xs);
    padding: var(--card-padding);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: none;
}

.compact-stats .stat-tile {
    min-height: calc(var(--stat-tile-min-height) - .35rem);
}

.featured-stats .stat-tile {
    min-height: calc(var(--stat-tile-min-height) + .35rem);
}

.stat-link {
    transition: border-color .18s ease, background .18s ease;
}

.stat-link:hover {
    border-color: rgba(0, 108, 73, .22);
    background: var(--primary-soft);
}

.stat-tile span {
    display: block;
    color: var(--muted);
    font-size: .68rem;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.stat-tile strong {
    display: block;
    margin-top: .2rem;
    font-size: var(--stat-value-size);
    font-weight: 950;
}

.stat-tile small {
    display: block;
    color: var(--muted);
    font-size: var(--small-font-size);
    font-weight: 750;
    line-height: 1.35;
}

.stat-tile.is-success {
    border-color: var(--success);
    border-left: 3px solid var(--success);
    background: var(--surface);
}

.stat-tile.is-warning {
    border-color: var(--warning);
    border-left: 3px solid var(--warning);
    background: var(--surface);
}

.stat-tile.is-danger {
    border-color: var(--danger);
    border-left: 3px solid var(--danger);
    background: var(--surface);
}

.stat-accent {
    color: var(--primary);
}

.dashboard-grid,
.record-layout,
.recipe-detail-grid,
.settings-layout,
.inventory-dashboard {
    display: grid;
    gap: var(--section-gap);
    margin-bottom: var(--section-gap);
}

.dashboard-main,
.record-main,
.recipe-detail-main,
.settings-main,
.inventory-main {
    display: grid;
    min-width: 0;
    gap: var(--section-gap);
}

.dashboard-side,
.record-side,
.recipe-detail-side,
.settings-side,
.inventory-side {
    display: grid;
    min-width: 0;
    align-content: start;
    gap: var(--grid-gap);
}

.action-card-grid,
.insight-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: var(--grid-gap);
    margin-bottom: var(--section-gap);
}

.insight-card,
.side-summary-card,
.timeline-card {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: none;
}

.insight-card,
.side-summary-card {
    padding: var(--panel-padding);
}

.side-summary-card.is-tinted,
.panel-tint {
    border-color: #b8e2d8;
    border-left: 3px solid var(--primary);
    background: var(--surface);
}

.insight-card h2,
.side-summary-card h2 {
    margin: 0;
    color: var(--primary);
    font-size: var(--section-heading-size);
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.insight-card p,
.side-summary-card p {
    margin: .28rem 0 0;
    color: var(--muted);
    font-weight: 650;
    line-height: 1.45;
}

.record-hero {
    display: grid;
    margin-bottom: var(--section-gap);
    gap: var(--grid-gap);
    align-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--panel-padding);
    box-shadow: none;
}

.record-hero-copy {
    min-width: 0;
}

.record-hero-copy h1 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .65rem;
    margin: 0;
    font-size: clamp(1.25rem, 2.2vw, 1.7rem);
    line-height: 1.08;
}

.record-hero-copy p {
    margin: .45rem 0 0;
    color: var(--muted);
    font-weight: 650;
    line-height: 1.45;
}

.record-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
}

.timeline-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: var(--panel-padding);
    list-style: none;
}

.timeline-item {
    position: relative;
    display: grid;
    gap: .25rem;
    padding: 0 0 .85rem 1.8rem;
}

.timeline-item::before {
    content: "";
    position: absolute;
    top: .25rem;
    left: .5rem;
    width: .65rem;
    height: .65rem;
    border: 2px solid var(--primary);
    border-radius: 999px;
    background: var(--surface);
    z-index: 1;
}

.timeline-item::after {
    content: "";
    position: absolute;
    top: 1.1rem;
    bottom: 0;
    left: .8rem;
    width: 2px;
    background: var(--border);
}

.timeline-item:last-child {
    padding-bottom: 0;
}

.timeline-item:last-child::after {
    display: none;
}

.timeline-item-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
}

.timeline-item h3 {
    margin: 0;
    font-size: 1rem;
    font-weight: 950;
}

.timeline-item time {
    border-radius: 999px;
    background: var(--surface-container);
    padding: .25rem .55rem;
    color: var(--text);
    font-size: .78rem;
    font-weight: 850;
}

.timeline-item .event-detail {
    color: var(--muted);
}

.summary-list.is-carded {
    padding: 0;
}

.summary-list.is-carded div {
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    background: transparent;
    padding: .45rem 0;
}

.metrics-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
    gap: var(--grid-gap);
    margin-bottom: var(--section-gap);
}

.metrics-strip .stat-tile {
    min-height: var(--stat-tile-min-height);
    padding: var(--card-padding);
}

.recipe-card.is-featured {
    border-color: var(--primary);
    box-shadow: none;
}

.recipe-card-kicker {
    color: var(--primary);
    font-size: .72rem;
    font-weight: 950;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.inventory-alert-list {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.inventory-alert-list li {
    border-left: 3px solid var(--danger);
    border-radius: var(--radius);
    background: var(--surface-muted);
    padding: .58rem .68rem;
}

.inventory-alert-list strong,
.inventory-alert-list span {
    display: block;
}

.inventory-alert-list span {
    margin-top: .25rem;
    color: var(--muted);
    font-size: .86rem;
    font-weight: 700;
}

.side-summary-card .button,
.inventory-alert-list + .button {
    margin-top: var(--space-sm);
}

.year-summary-panel {
    display: grid;
    gap: var(--grid-gap);
    align-items: end;
    margin-bottom: var(--section-gap);
}

.year-summary-panel h2 {
    margin: 0;
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.25;
}

.year-selector {
    display: grid;
    gap: .35rem;
}

.year-selector label {
    color: var(--muted);
    font-size: .74rem;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}


.status-pill {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--surface-soft);
    padding: .32rem .6rem;
    color: var(--muted);
    font-size: var(--status-font-size);
    font-weight: 950;
    line-height: 1.2;
}

.status-blue {
    border-color: var(--border-strong);
    background: var(--surface-muted);
    color: var(--primary-dark);
}

.status-green {
    border-color: var(--success);
    background: var(--success-soft);
    color: var(--success);
}

.status-amber {
    border-color: var(--warning);
    background: var(--warning-soft);
    color: var(--warning);
}

.status-red {
    border-color: var(--danger);
    background: var(--danger-soft);
    color: var(--danger);
}

.status-violet {
    border-color: var(--border-strong);
    background: var(--surface-muted);
    color: #5130c6;
}

.module-grid,
.quick-actions-grid,
.recipe-grid,
.inventory-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
    gap: var(--grid-gap);
}

.module-group-list {
    display: grid;
    gap: var(--section-gap);
}

.module-group-section {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--surface) 88%, transparent);
    box-shadow: none;
}

.module-group-section .module-grid {
    padding: var(--panel-padding);
}

.module-card,
.quick-action,
.recipe-card,
.inventory-card,
.group-item,
.checkbox-row,
.ingredient-row-card {
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    box-shadow: none;
}

.module-card,
.quick-action {
    display: flex;
    min-height: var(--stat-tile-min-height);
    align-items: flex-start;
    gap: var(--space-sm);
    padding: var(--panel-padding);
    transition: background .18s ease, border-color .18s ease;
}

.quick-actions-grid {
    padding: var(--panel-padding);
}

.quick-action {
    min-height: auto;
    background: var(--surface-soft);
}

.module-card:hover,
.quick-action:hover,
.recipe-card:hover,
.inventory-card:hover {
    border-color: rgba(0, 108, 73, .22);
    background: var(--primary-soft);
}

.module-icon {
    display: inline-flex;
    flex: 0 0 auto;
    width: calc(var(--control-height) - .1rem);
    height: calc(var(--control-height) - .1rem);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius);
    background: var(--surface-container);
    color: var(--primary-dark);
    font-weight: 950;
}

.module-icon svg {
    width: var(--icon-size);
    height: var(--icon-size);
}

.sidebar-nav-link .module-icon.compact {
    background: transparent;
    color: inherit;
}

.module-icon.amber {
    background: var(--warning-soft);
    color: var(--warning);
}

.module-icon.green {
    background: var(--secondary-soft);
    color: var(--secondary);
}

.module-card h2,
.quick-action strong,
.recipe-card h2,
.inventory-card h3 {
    margin: 0;
    font-size: var(--card-title-size);
    font-weight: 950;
}

.module-card p,
.quick-action small,
.recipe-card p,
.inventory-card p {
    display: block;
    margin: .22rem 0 0;
    color: var(--muted);
    font-weight: 600;
    line-height: 1.45;
}

.dashboard-heading {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    margin-bottom: var(--section-gap);
}

.dashboard-heading h1 {
    margin: 0;
    font-size: var(--page-title-size);
    font-weight: 950;
    line-height: 1.05;
}

.mobile-quick-dashboard {
    display: none;
}

.wide-dashboard {
    display: block;
}

.mobile-quick-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.quick-action-large {
    min-height: 4rem;
    flex-direction: column;
    align-items: flex-start;
    gap: .45rem;
    padding: .68rem;
}

.quick-action-large .module-icon {
    width: 2rem;
    height: 2rem;
}

.quick-action-large strong {
    font-size: .88rem;
    line-height: 1.2;
}

.compact-heading {
    padding-block: .75rem;
}

.quick-list {
    display: grid;
    gap: .4rem;
    padding: var(--panel-padding);
}

.quick-list-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .55rem;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .55rem .65rem;
}

.quick-list-marker {
    width: .65rem;
    height: .65rem;
    border-radius: 999px;
    background: var(--border-strong);
}

.quick-list-item.priority-urgent .quick-list-marker {
    background: var(--danger);
}

.quick-list-item.priority-today .quick-list-marker {
    background: var(--primary);
}

.quick-list-item.priority-upcoming .quick-list-marker {
    background: var(--warning);
}

.quick-list-item strong,
.quick-list-item small,
.quick-list-empty {
    display: block;
}

.quick-list-item strong {
    font-weight: 950;
    line-height: 1.25;
}

.quick-list-item small {
    margin-top: .18rem;
    color: var(--muted);
    font-size: .76rem;
    font-weight: 850;
}

.quick-list-empty {
    border-radius: var(--radius);
    background: var(--surface-soft);
    padding: .65rem;
    color: var(--muted);
    font-weight: 850;
    text-align: center;
}

.today-task-group-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: var(--grid-gap);
    padding: var(--panel-padding);
}

.today-task-group-grid--quick {
    grid-template-columns: 1fr;
    padding: var(--panel-padding);
}

.today-task-group-card {
    display: grid;
    min-width: 0;
    gap: .58rem;
    border: 1px solid var(--border-strong);
    border-left: .25rem solid var(--primary);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--card-padding);
    box-shadow: none;
}

.today-task-group-card--danger {
    border-left-color: var(--danger);
}

.today-task-group-card--warning,
.today-task-group-card--amber {
    border-left-color: var(--warning);
}

.today-task-group-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .55rem;
    align-items: center;
}

.today-task-group-head h3,
.today-task-group-head strong,
.today-task-group-card p,
.today-task-preview strong,
.today-task-preview small {
    display: block;
    min-width: 0;
}

.today-task-group-head h3 {
    margin: 0;
    color: var(--muted);
    font-size: .72rem;
    font-weight: 950;
    line-height: 1.2;
    text-transform: uppercase;
}

.today-task-group-head strong {
    margin-top: .15rem;
    color: var(--text);
    font-size: 1rem;
    font-weight: 950;
    line-height: 1.15;
}

.today-task-group-card p {
    margin: 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.35;
}

.today-task-preview-list {
    display: grid;
    gap: .45rem;
}

.today-task-preview {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .45rem;
    align-items: center;
    border-radius: var(--radius-sm);
    background: var(--surface-soft);
    padding: .5rem .58rem;
    color: var(--text);
}

.today-task-preview strong {
    font-weight: 950;
    line-height: 1.25;
}

.today-task-preview small,
.today-task-more {
    color: var(--muted);
    font-size: .76rem;
    font-weight: 850;
}

.today-task-more {
    padding-inline: .65rem;
}

.today-task-group-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    align-items: center;
}

.today-task-group-actions .button {
    flex: 1 1 9rem;
}

.today-task-dialog {
    width: min(100% - 2rem, 42rem);
    max-height: min(90vh, 48rem);
    overflow: hidden;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius);
    background: var(--surface);
    padding: 0;
    color: var(--text);
    box-shadow: var(--shadow-strong);
}

.today-task-dialog::backdrop {
    background: rgba(16, 32, 51, .45);
}

.today-task-dialog-form {
    display: grid;
    max-height: inherit;
    grid-template-rows: auto minmax(0, 1fr) auto auto;
}

.today-task-dialog-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--grid-gap);
    align-items: start;
    border-bottom: 1px solid var(--border);
    padding: var(--panel-padding);
}

.today-task-dialog-header h2 {
    margin: .15rem 0 0;
    font-size: clamp(1.05rem, 2vw, 1.35rem);
    font-weight: 950;
}

.today-task-dialog-header p {
    margin: .35rem 0 0;
    color: var(--muted);
    font-weight: 800;
    line-height: 1.35;
}

.dialog-close-button {
    display: inline-grid;
    width: var(--control-height);
    height: var(--control-height);
    place-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface-soft);
    color: var(--muted);
    font-size: 1.25rem;
    font-weight: 950;
    cursor: pointer;
}

.today-task-dialog-list {
    display: grid;
    gap: .5rem;
    overflow: auto;
    padding: var(--panel-padding);
}

.today-task-dialog .today-task-submit {
    grid-template-columns: 1fr;
    border-top: 1px solid var(--border);
}

.today-task-dialog-item {
    display: grid;
    gap: .55rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface-soft);
    padding: .62rem;
}

.today-task-dialog-item.is-selected {
    border-color: rgba(0, 108, 73, .36);
    background: var(--success-soft);
}

.today-task-dialog-check {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .75rem;
    align-items: center;
    cursor: pointer;
}

.today-task-dialog-check strong,
.today-task-dialog-check small {
    display: block;
    min-width: 0;
}

.today-task-dialog-check strong {
    font-weight: 950;
    line-height: 1.25;
}

.today-task-dialog-check small {
    margin-top: .18rem;
    color: var(--muted);
    font-weight: 800;
}

.today-task-dialog-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    justify-content: flex-end;
    border-top: 1px solid var(--border);
    padding: var(--panel-padding);
}

.dashboard-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 10.75rem), 1fr));
    gap: var(--grid-gap);
}

.dashboard-stat-card {
    position: relative;
    display: grid;
    min-height: calc(var(--stat-tile-min-height) + .15rem);
    grid-template-columns: auto minmax(0, 1fr);
    align-content: center;
    gap: .18rem .55rem;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--card-padding);
    box-shadow: none;
    transition: background .18s ease, border-color .18s ease;
}

.dashboard-stat-card:hover {
    border-color: rgba(0, 108, 73, .34);
    background: var(--primary-soft);
}

.dashboard-card-icon,
.activity-icon {
    display: inline-flex;
    width: calc(var(--control-height) - .18rem);
    height: calc(var(--control-height) - .18rem);
    align-items: center;
    justify-content: center;
    border-radius: var(--radius);
    background: var(--primary-soft);
    color: var(--primary);
}

.dashboard-stat-card .dashboard-card-icon {
    grid-row: 1 / span 3;
}

.dashboard-card-icon svg,
.activity-icon svg {
    width: var(--icon-size);
    height: var(--icon-size);
}

.dashboard-card-label {
    color: var(--muted);
    font-size: .7rem;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.dashboard-stat-card strong {
    display: block;
    color: var(--text);
    font-size: var(--stat-value-size);
    font-weight: 950;
    line-height: 1.02;
}

.dashboard-stat-card strong small {
    font-size: .82rem;
    font-weight: 900;
}

.dashboard-stat-card > small {
    grid-column: 2;
    color: var(--muted);
    font-size: .76rem;
    font-weight: 800;
}

.dashboard-stat-card--danger {
    border-color: var(--danger);
}

.dashboard-stat-card--danger .dashboard-card-icon {
    background: var(--danger-soft);
    color: var(--danger);
}

.dashboard-card-icon.danger,
.dashboard-card-icon.urgent {
    background: var(--danger-soft);
    color: var(--danger);
}

.dashboard-stat-card--warning .dashboard-card-icon {
    background: var(--warning-soft);
    color: var(--warning);
}

.dashboard-stat-card--amber .dashboard-card-icon,
.dashboard-card-icon.warning,
.dashboard-card-icon.amber {
    background: var(--warning-soft);
    color: var(--warning);
}

.dashboard-stat-card--green .dashboard-card-icon {
    background: var(--primary-soft);
    color: var(--primary);
}

.dashboard-card-icon.green {
    background: var(--primary-soft);
    color: var(--primary);
}

.management-panel {
    background: var(--surface);
}

.management-module-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
    gap: var(--grid-gap);
    padding: var(--panel-padding);
}

.management-module-tile {
    display: grid;
    min-height: 2.7rem;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .5rem;
    align-items: center;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--card-padding);
    color: var(--text);
    font-weight: 950;
    text-align: left;
    transition: background .18s ease, border-color .18s ease;
}

.management-module-tile:hover,
.management-module-tile.is-active {
    border-color: rgba(0, 108, 73, .35);
    background: var(--primary-soft);
}

.dashboard-action-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
    gap: var(--grid-gap);
}

.dashboard-action-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: var(--space-sm);
    align-items: center;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--panel-padding);
    box-shadow: none;
}

.dashboard-action-card strong,
.dashboard-action-card small {
    display: block;
}

.dashboard-action-card strong {
    font-size: .92rem;
    font-weight: 950;
}

.dashboard-action-card small {
    margin-top: .25rem;
    color: var(--muted);
    font-weight: 700;
    line-height: 1.35;
}

.dashboard-alert-list,
.activity-timeline {
    display: grid;
    gap: .5rem;
    padding: var(--panel-padding);
}

.dashboard-alert {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .7rem;
    align-items: center;
    border-left: 3px solid var(--border-strong);
    border-radius: var(--radius);
    background: var(--surface-muted);
    padding: .62rem .72rem;
}

.dashboard-alert--urgent {
    border-left-color: var(--danger);
    background: var(--surface);
}

.dashboard-alert--today,
.dashboard-alert--upcoming {
    border-left-color: var(--primary);
    background: var(--surface);
}

.dashboard-alert-marker {
    color: inherit;
    font-size: 1rem;
    font-weight: 950;
}

.dashboard-alert strong,
.dashboard-alert small {
    display: block;
}

.dashboard-alert small {
    margin-top: .2rem;
    color: var(--muted);
    font-weight: 700;
}

.activity-panel {
    overflow: hidden;
}

.activity-item {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .65rem;
    align-items: start;
}

.activity-item time,
.activity-item strong,
.activity-item small {
    display: block;
}

.activity-item time {
    color: var(--muted);
    font-size: .78rem;
    font-weight: 900;
}

.activity-item strong {
    margin-top: .1rem;
    font-weight: 950;
}

.activity-item small {
    margin-top: .2rem;
    color: var(--muted);
    font-weight: 700;
    line-height: 1.35;
}

.activity-link {
    display: block;
    margin: .1rem var(--panel-padding) var(--panel-padding);
    border-top: 1px solid var(--border);
    padding-top: .62rem;
    color: var(--primary);
    font-weight: 950;
    text-align: center;
}

.conditions-card {
    display: grid;
    gap: .28rem;
    border: 1px solid var(--border);
    border-left: 3px solid var(--primary);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--panel-padding);
    color: var(--text);
    min-height: auto;
}

.conditions-card strong {
    color: var(--primary);
    font-size: 1.05rem;
    font-weight: 950;
}

.conditions-card span {
    font-weight: 800;
}

.module-catalog-list {
    display: grid;
    gap: var(--section-gap);
}

.search-results-list {
    display: grid;
    gap: var(--section-gap);
}

.search-result-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
    gap: var(--grid-gap);
    padding: var(--panel-padding);
}

.search-result-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .6rem;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    padding: .58rem .68rem;
    transition: border-color .18s ease, background .18s ease;
}

.search-result-card:hover {
    border-color: rgba(0, 108, 73, .28);
    background: var(--primary-soft);
}

.search-result-copy {
    display: grid;
    min-width: 0;
    gap: .18rem;
}

.search-result-copy strong,
.search-result-copy small,
.search-result-copy em {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.search-result-copy strong {
    color: var(--text);
    font-weight: 950;
}

.search-result-copy small {
    color: var(--muted);
    font-size: .84rem;
    font-weight: 700;
    line-height: 1.35;
}

.search-result-copy em {
    color: var(--primary);
    font-size: .74rem;
    font-style: normal;
    font-weight: 950;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.catalog-module-card {
    min-height: var(--stat-tile-min-height);
}

.catalog-module-card small {
    display: inline-flex;
    margin-top: .65rem;
    border-radius: 999px;
    background: var(--surface-container);
    padding: .28rem .55rem;
    color: var(--muted);
    font-size: .76rem;
    font-weight: 900;
}

.catalog-module-card.is-muted {
    opacity: .68;
}

.calculator-layout,
.detail-layout,
.sale-document-layout {
    display: grid;
    gap: var(--section-gap);
}

.sale-document-layout {
    align-items: start;
}

.sale-side-panel,
.calculator-price-panel {
    align-self: start;
}

.sale-side-panel {
    display: grid;
    gap: var(--grid-gap);
    padding-bottom: var(--panel-padding);
}

.sale-side-panel > :not(.section-heading) {
    margin-inline: var(--panel-padding);
}

.sale-option {
    display: block;
}

.sale-import-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
}

.sale-import-actions .button {
    flex: 1 1 12rem;
}

.sale-side-note {
    display: grid;
    gap: .25rem;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface-soft);
    padding: .68rem;
}

.sale-side-note strong,
.sale-side-note span {
    display: block;
}

.sale-side-note span {
    color: var(--muted);
    font-weight: 750;
}

.price-input-list {
    display: grid;
    gap: .5rem;
    padding: var(--panel-padding);
}

.price-input-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 9.5rem;
    gap: .55rem;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface-soft);
    padding: .6rem;
}

.price-input-row strong,
.price-input-row small {
    display: block;
}

.price-input-row small {
    margin-top: .2rem;
    color: var(--muted);
    font-weight: 700;
}

.recipe-card {
    display: grid;
    gap: .65rem;
    padding: var(--card-padding);
    transition: background .18s ease, border-color .18s ease;
}

.recipe-card-header,
.recipe-card-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .55rem;
}

.recipe-cost-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}

.recipe-cost-strip div {
    border-radius: var(--radius);
    background: var(--surface-soft);
    padding: .55rem .62rem;
}

.recipe-cost-strip div:only-child {
    grid-column: 1 / -1;
}

.recipe-cost-strip span,
.summary-list dt {
    display: block;
    color: var(--muted);
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.recipe-cost-strip strong,
.summary-list dd {
    display: block;
    margin: .25rem 0 0;
    font-weight: 950;
}

.recipe-cost-strip small {
    display: block;
    margin-top: .35rem;
    color: var(--danger);
    font-size: .78rem;
    font-weight: 800;
    line-height: 1.35;
}

.ingredient-summary-list {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ingredient-summary-list li,
.summary-list div {
    display: flex;
    justify-content: space-between;
    gap: var(--space-md);
    border-bottom: 1px solid var(--border);
    padding: .34rem 0;
}

.summary-list {
    display: grid;
    gap: .35rem;
    margin: 0;
    padding: var(--panel-padding);
}

.summary-list dd {
    margin-left: 0;
    text-align: right;
}

.inventory-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-sm);
    align-items: center;
    padding: var(--panel-padding);
    transition: background .18s ease, border-color .18s ease;
}

.inventory-stock {
    min-width: 7rem;
    text-align: right;
}

.inventory-stock strong {
    display: block;
    color: var(--primary);
    font-size: 1.18rem;
    font-weight: 950;
}

.inventory-stock.is-low strong {
    color: var(--danger);
}

.inventory-stock span {
    display: block;
    color: var(--muted);
    font-weight: 850;
}

.info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--grid-gap);
}

.info-field {
    display: grid;
    gap: .35rem;
}

.info-value {
    min-height: var(--control-height);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface-soft);
    padding: .62rem .8rem;
    color: #1e2f44;
    font-weight: 800;
}

.task-sections {
    display: grid;
    gap: var(--section-gap);
}

.task-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    gap: var(--grid-gap);
}

.task-summary-card {
    display: grid;
    align-content: start;
    gap: .6rem;
    min-height: auto;
    border: 1px solid var(--border);
    border-left: 3px solid var(--primary);
    border-top: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    padding: var(--card-padding);
    box-shadow: none;
}

.task-summary-card.has-urgent {
    border-left-color: var(--danger);
}

.task-summary-card > .button {
    align-self: end;
    margin-top: auto;
}

.task-summary-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .55rem;
}

.task-summary-heading h2,
.task-summary-heading p {
    margin: 0;
}

.task-area-label {
    display: block;
    margin-bottom: .25rem;
    color: var(--primary);
    font-size: .72rem;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.task-summary-heading p,
.task-card-empty,
.task-more-count {
    margin: .25rem 0 0;
    color: var(--muted);
    font-size: .85rem;
    font-weight: 700;
}

.task-preview-list {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.task-preview-list li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .55rem;
    align-items: start;
    border-bottom: 1px solid var(--border);
    padding-bottom: .45rem;
    font-size: .85rem;
    font-weight: 800;
}

.task-preview-list li.priority-urgent {
    border-left: 3px solid var(--danger);
    padding-left: .55rem;
}

.task-preview-list strong,
.task-preview-list small {
    display: block;
}

.task-preview-list small,
.task-preview-list em {
    flex: 0 0 auto;
    color: var(--muted);
}

.task-preview-list small {
    margin-top: .18rem;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.35;
}

.task-preview-list em {
    font-size: .74rem;
    font-style: normal;
    font-weight: 950;
    white-space: nowrap;
}

.task-preview-list li.priority-urgent em {
    color: var(--danger);
}

.task-preview-list li.priority-today em {
    color: var(--primary);
}

.task-center-notice {
    margin-bottom: var(--section-gap);
}

.sow-tools-grid {
    margin-bottom: var(--section-gap);
}

.sow-attention-panel {
    margin-bottom: var(--section-gap);
}


.task-list {
    display: grid;
}

.task-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
    border-left: 3px solid var(--border-strong);
    border-bottom: 1px solid var(--border);
    padding: .68rem .78rem;
}

.task-item:last-child {
    border-bottom: 0;
}

.task-item.priority-urgent {
    border-left-color: var(--danger);
    background: var(--danger-soft);
}

.task-item.priority-today {
    border-left-color: var(--warning);
    background: var(--warning-soft);
}

.task-item.priority-upcoming {
    border-left-color: var(--primary);
}

.task-item.priority-informational {
    border-left-color: var(--muted);
}

.task-item-body {
    min-width: 0;
}

.task-item-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
}

.task-item-title {
    color: var(--text);
    font-weight: 950;
}

a.task-item-title:hover {
    color: var(--primary);
    text-decoration: underline;
}

.task-item p,
.task-item small {
    display: block;
    margin: .3rem 0 0;
    color: var(--muted);
    font-weight: 650;
    line-height: 1.4;
}

.task-status {
    border-radius: 999px;
    background: var(--surface-muted);
    padding: .25rem .5rem;
    color: #425466;
    font-size: .72rem;
    font-weight: 950;
}


.danger-zone {
    margin-top: var(--section-gap);
    border: 1px solid var(--danger);
    border-radius: var(--radius);
    background: var(--danger-soft);
    padding: var(--panel-padding);
    text-align: right;
}