/* Isolated home-dashboard component layouts. Loaded after site.css so the
   legacy stylesheet's duplicated dashboard declarations cannot override them. */
.dashboard-stat-row {
    display: grid;
    gap: 0;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.35fr) minmax(0, 1.1fr);
    padding: 0;
}

.dashboard-stat-row .dashboard-stat-cell {
    align-items: center;
    display: grid;
    gap: .28rem;
    grid-template-columns: auto minmax(0, 1fr);
    min-width: 0;
    padding: .5rem .8rem;
}

.dashboard-stat-row .dashboard-stat-cell + .dashboard-stat-cell { border-left: 1px solid rgba(215, 209, 197, .9); }
.dashboard-stat-row .dashboard-stat-cell b { font-size: 1rem; line-height: 1; }
.dashboard-stat-row .dashboard-stat-cell small { color: var(--muted); font: inherit; line-height: 1.15; overflow-wrap: anywhere; }
.dashboard-stat-row:not(:has(> :nth-child(3))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.dashboard-crop-snapshot {
    background: linear-gradient(140deg, #F6F0DF, #FFFDF8);
    border: 1px solid var(--border);
    border-radius: 7px;
    display: grid;
    gap: .45rem;
    margin: .6rem 0;
    padding: .65rem;
}

.dashboard-crop-summary {
    align-items: center;
    display: grid;
    gap: .6rem;
    grid-template-columns: minmax(6.75rem, 8.25rem) minmax(0, 1fr);
}

.dashboard-crop-art {
    align-items: center;
    display: flex;
    gap: .3rem;
    justify-content: flex-start;
    min-width: 0;
}

.dashboard-crop-art-item {
    align-items: center;
    background: #F6F0DF;
    border: 1px solid #E4D8BC;
    border-radius: 50%;
    display: grid;
    flex: 0 0 3rem;
    height: 3rem;
    justify-content: center;
    width: 3rem;
}

.dashboard-crop-art-item .crop-visual { height: 2.8rem; margin: 0; width: 2.8rem; }
.dashboard-crop-content { display: grid; gap: .32rem; min-width: 0; }
.dashboard-crop-count { display: grid; gap: .05rem; line-height: 1; }
.dashboard-crop-count b { color: var(--ink); font-size: 1.45rem; }
.dashboard-crop-count span { color: var(--muted); font-size: .77rem; font-weight: 700; line-height: 1.15; text-transform: uppercase; }
.dashboard-crop-status { color: var(--muted); display: grid; gap: .1rem; line-height: 1.2; }
.dashboard-crop-status strong { color: var(--green); font-size: .82rem; font-weight: 800; }
.dashboard-crop-status.is-due strong { color: var(--orange); }
.dashboard-crop-status span { font-size: .78rem; }
.dashboard-crop-next { border-top: 1px solid var(--line-soft); color: var(--ink); font-size: .78rem; font-weight: 700; padding-top: .4rem; }

.dashboard-layout-header {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: .5rem;
    justify-content: space-between;
    margin-bottom: .35rem;
    width: 100%;
}

.dashboard-layout-header h3 { flex: 1 1 auto; margin: 0; }
.dashboard-layout-header .layout-open-action { flex: 0 0 auto; margin: 0; white-space: nowrap; }
.dashboard-layout-preview .layout-thumbnail-link {
    aspect-ratio: 900 / 420;
    height: auto;
    margin-bottom: .45rem;
}
.dashboard-layout-preview .farm-layout-thumb { transform: none; }
.dashboard-stat-row--crops { grid-template-columns: minmax(0, .75fr) minmax(0, 1.1fr) minmax(0, 1.45fr); }
.dashboard-stat-row--crops .dashboard-stat-cell:last-child small { font-size: .66rem; white-space: nowrap; }

@media (max-width: 720px) {
    .dashboard-stat-row .dashboard-stat-cell { gap: .22rem; padding-inline: .72rem; }
    .dashboard-stat-row .dashboard-stat-cell b { font-size: .92rem; }
    .dashboard-stat-row .dashboard-stat-cell small { font-size: .66rem; }
    .dashboard-crop-summary { grid-template-columns: 6.75rem minmax(0, 1fr); }
    .dashboard-crop-art-item { flex-basis: 2.9rem; height: 2.9rem; width: 2.9rem; }
    .dashboard-crop-art-item .crop-visual { height: 2.68rem; width: 2.68rem; }
}

@media (max-width: 390px) {
    .dashboard-stat-row .dashboard-stat-cell { padding-inline: .66rem; }
    .dashboard-stat-row .dashboard-stat-cell small { font-size: .62rem; }
    .dashboard-crop-snapshot { gap: .35rem; padding: .58rem; }
    .dashboard-crop-summary { gap: .5rem; grid-template-columns: 6.3rem minmax(0, 1fr); }
    .dashboard-crop-art { gap: .2rem; }
    .dashboard-crop-art-item { flex-basis: 2.8rem; height: 2.8rem; width: 2.8rem; }
    .dashboard-crop-art-item .crop-visual { height: 2.58rem; width: 2.58rem; }
}