/*
 * Compras de leche: captura móvil (.cp-*) y planilla semanal (.ps-*).
 * CSS plano registrado con FilamentAsset; usa las variables de color de Filament.
 */

[x-cloak] { display: none !important; }

/* ---------- Captura móvil ---------- */

.cp { display: flex; flex-direction: column; gap: 1rem; }

.cp-offline {
    padding: .75rem 1rem; border-radius: .75rem;
    background: var(--danger-600); color: white; font-size: .95rem;
}

.cp-context { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }

.cp-field { display: flex; flex-direction: column; gap: .25rem; font-size: .8rem; color: var(--gray-500); }
.cp-field strong { font-size: 1rem; color: var(--gray-950); }
.cp-field select, .cp-field input {
    width: 100%; min-height: 2.75rem; padding: .5rem .75rem; font-size: 1rem;
    border: 1px solid var(--gray-300); border-radius: .5rem; background: white; color: var(--gray-950);
}

.cp-counter { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.cp-counter > div {
    display: flex; flex-direction: column; align-items: center; padding: .6rem .25rem;
    border-radius: .75rem; background: var(--primary-50); color: var(--primary-800);
}
.cp-counter strong { font-size: 1.4rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
.cp-counter span { font-size: .75rem; }

.cp-search input {
    width: 100%; min-height: 3.25rem; padding: .75rem 1rem; font-size: 1.1rem;
    border: 2px solid var(--primary-400); border-radius: .75rem; background: white; color: var(--gray-950);
}

.cp-results, .cp-list ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }

.cp-result, .cp-captured {
    width: 100%; text-align: left; display: flex; flex-direction: column; gap: .15rem;
    padding: .8rem 1rem; min-height: 3.5rem; border-radius: .75rem;
    border: 1px solid var(--gray-200); background: white; color: var(--gray-950);
}
.cp-result:active, .cp-captured:active { background: var(--primary-50); }
.cp-result-name { font-weight: 600; font-size: 1rem; }
.cp-result-meta, .cp-captured-meta { font-size: .8rem; color: var(--gray-500); }
.cp-result--done { opacity: .65; }
.cp-result--done .cp-result-meta { color: var(--success-700); }

.cp-entry { display: flex; flex-direction: column; gap: .75rem; padding: 1rem; border-radius: 1rem; background: white; border: 1px solid var(--gray-200); }
.cp-entry-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; }
.cp-entry-supplier { font-size: .85rem; color: var(--gray-500); }
.cp-entry-farm { font-size: 1.25rem; font-weight: 700; }
.cp-link { color: var(--primary-700); font-weight: 600; padding: .5rem; }

.cp-notice { padding: .65rem .85rem; border-radius: .6rem; background: var(--warning-50); color: var(--warning-800); font-size: .9rem; }
.cp-notice--locked { background: var(--gray-100); color: var(--gray-700); }

.cp-liters { display: flex; flex-direction: column; gap: .25rem; font-size: .85rem; color: var(--gray-500); }
.cp-liters input {
    width: 100%; padding: .6rem 1rem; font-size: 2.5rem; font-weight: 700; text-align: center;
    font-variant-numeric: tabular-nums; border: 2px solid var(--gray-300); border-radius: .75rem;
    background: white; color: var(--gray-950);
}
.cp-liters input:focus { border-color: var(--primary-500); outline: none; }
.cp-error { color: var(--danger-600); font-size: .9rem; margin: 0; }

.cp-save {
    min-height: 3.5rem; border-radius: .75rem; font-size: 1.15rem; font-weight: 700;
    background: var(--primary-600); color: white;
}
.cp-save:disabled { opacity: .5; }

.cp-list h3 { font-size: .9rem; font-weight: 600; color: var(--gray-600); margin: 0 0 .5rem; }
.cp-captured { display: grid; grid-template-columns: 1fr auto; column-gap: .75rem; }
.cp-captured-name { font-weight: 600; }
.cp-captured-liters { grid-row: span 2; align-self: center; font-size: 1.15rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.cp-captured--locked { opacity: .6; }
.cp-empty { color: var(--gray-500); font-size: .9rem; padding: .5rem; }

:where(.dark) .cp-field strong, :where(.dark) .cp-entry-farm { color: white; }
:where(.dark) .cp-field select, :where(.dark) .cp-field input, :where(.dark) .cp-search input,
:where(.dark) .cp-result, :where(.dark) .cp-captured, :where(.dark) .cp-entry, :where(.dark) .cp-liters input {
    background: var(--gray-900); color: white; border-color: var(--gray-700);
}
:where(.dark) .cp-counter > div { background: color-mix(in oklab, var(--primary-500) 15%, transparent); color: var(--primary-300); }
:where(.dark) .cp-notice { background: color-mix(in oklab, var(--warning-500) 15%, transparent); color: var(--warning-300); }

/* ---------- Planilla semanal ---------- */

.ps-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem; align-items: flex-end; }
.ps-toolbar-group { display: flex; flex-wrap: wrap; gap: .75rem; align-items: flex-end; }
.ps-field { display: flex; flex-direction: column; gap: .2rem; font-size: .75rem; color: var(--gray-500); }
.ps-field strong { font-size: .95rem; color: var(--gray-950); }
.ps-field select, .ps-date, .ps-filter {
    min-height: 2.25rem; padding: .35rem .65rem; font-size: .9rem;
    border: 1px solid var(--gray-300); border-radius: .5rem; background: white; color: var(--gray-950);
}
.ps-filter { min-width: 16rem; }
.ps-cycle-nav { display: flex; gap: .35rem; align-items: center; }

.ps-live { font-size: .8rem; color: var(--gray-400); white-space: nowrap; }
.ps-live--on { color: var(--success-600); }

.ps-help { font-size: .8rem; color: var(--gray-500); margin: 0; display: flex; flex-wrap: wrap; gap: .35rem .75rem; align-items: center; }
.ps-legend { padding: 0 .4rem; border-radius: .25rem; }
.ps-legend--empty { background: var(--warning-50); }
.ps-legend--outlier { background: var(--danger-100); color: var(--danger-800); }
.ps-legend--locked { background: var(--gray-200); }
.ps-viewers { color: var(--primary-700); font-weight: 600; }

.ps-wrap {
    position: relative; overflow: auto; max-height: calc(100vh - 15rem);
    border: 1px solid var(--gray-200); border-radius: .75rem; background: white;
}

.ps-table { border-collapse: separate; border-spacing: 0; width: 100%; font-size: .875rem; }
.ps-table th, .ps-table td { border-bottom: 1px solid var(--gray-100); border-right: 1px solid var(--gray-100); padding: 0; }
.ps-table thead th {
    position: sticky; top: 0; z-index: 2; background: var(--gray-50);
    padding: .4rem .5rem; font-weight: 600; text-align: center; white-space: nowrap;
}
.ps-day span { display: block; }
.ps-day small { color: var(--gray-500); font-weight: 400; }
.ps-day--today { color: var(--primary-700); }
.ps-table tfoot td, .ps-table tfoot th {
    position: sticky; bottom: 0; z-index: 2; background: var(--gray-50); font-weight: 700; padding: .4rem .5rem;
}
.ps-sticky { position: sticky; left: 0; z-index: 1; background: white; text-align: left; }
.ps-table thead .ps-sticky, .ps-table tfoot .ps-sticky { z-index: 3; background: var(--gray-50); }
.ps-farm { padding: .3rem .6rem !important; min-width: 15rem; max-width: 22rem; font-weight: 400; }
.ps-farm-head { text-align: left !important; }
.ps-supplier { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-farm-name { display: block; font-size: .8rem; color: var(--gray-500); }
.ps-farm-name em { color: var(--warning-700); }
.ps-num { text-align: right !important; padding: .3rem .6rem !important; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ps-empty-row { padding: 1.5rem !important; text-align: center; color: var(--gray-500); }

.ps-cell {
    width: 5.25rem; height: 2.25rem; padding: 0 .5rem; border: 0; border-radius: 0;
    text-align: right; font-variant-numeric: tabular-nums; font-size: .9rem;
    background: transparent; color: var(--gray-950); outline: none;
    transition: background-color .4s;
}
.ps-cell:focus { box-shadow: inset 0 0 0 2px var(--primary-500); background: var(--primary-50); }
.ps-cell[readonly] { cursor: default; }
.ps-cell--empty { background: var(--warning-50); }
.ps-cell--outlier { background: var(--danger-100); color: var(--danger-800); font-weight: 700; }
.ps-cell--locked { background: var(--gray-100); color: var(--gray-500); }
.ps-cell--dirty { font-style: italic; }
.ps-cell--saving { color: var(--gray-400); }
.ps-cell--invalid { box-shadow: inset 0 0 0 2px var(--danger-500) !important; background: var(--danger-50); }
.ps-cell--flash { animation: ps-flash 1.2s ease-out; }
@keyframes ps-flash { from { background: var(--success-200); } }

.ps-conflict { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; background: rgb(0 0 0 / .35); }
.ps-conflict[hidden] { display: none; }
.ps-conflict-box { width: min(28rem, 92vw); padding: 1.25rem; border-radius: 1rem; background: white; box-shadow: 0 20px 40px rgb(0 0 0 / .2); }
.ps-conflict-box h3 { font-size: 1.05rem; font-weight: 700; margin: 0 0 .5rem; }
.ps-conflict-box p { margin: .25rem 0; font-size: .9rem; }
.ps-conflict-message { color: var(--warning-700); font-weight: 600; }
.ps-conflict-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: 1rem; }

:where(.dark) .ps-wrap, :where(.dark) .ps-sticky, :where(.dark) .ps-conflict-box { background: var(--gray-900); }
:where(.dark) .ps-table thead th, :where(.dark) .ps-table tfoot td, :where(.dark) .ps-table tfoot th,
:where(.dark) .ps-table thead .ps-sticky, :where(.dark) .ps-table tfoot .ps-sticky { background: var(--gray-800); }
:where(.dark) .ps-table th, :where(.dark) .ps-table td { border-color: var(--gray-800); }
:where(.dark) .ps-wrap { border-color: var(--gray-700); }
:where(.dark) .ps-cell, :where(.dark) .ps-field strong { color: white; }
:where(.dark) .ps-field select, :where(.dark) .ps-date, :where(.dark) .ps-filter { background: var(--gray-900); color: white; border-color: var(--gray-700); }
:where(.dark) .ps-cell:focus { background: color-mix(in oklab, var(--primary-500) 15%, transparent); }
:where(.dark) .ps-cell--empty, :where(.dark) .ps-legend--empty { background: color-mix(in oklab, var(--warning-500) 10%, transparent); }
:where(.dark) .ps-cell--outlier, :where(.dark) .ps-legend--outlier { background: color-mix(in oklab, var(--danger-500) 25%, transparent); color: var(--danger-200); }
:where(.dark) .ps-cell--locked, :where(.dark) .ps-legend--locked { background: var(--gray-800); color: var(--gray-400); }

/* Ciclo cerrado por una liquidación (borrador o aprobada) */
.ps-closed { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .6rem .85rem; border-radius: .5rem; background: var(--warning-50); color: var(--warning-800); border: 1px solid var(--warning-200); font-size: .875rem; }
.ps-closed-icon { width: 1.1rem; height: 1.1rem; }
:where(.dark) .ps-closed { background: color-mix(in oklab, var(--warning-500) 12%, transparent); color: var(--warning-300); border-color: color-mix(in oklab, var(--warning-500) 30%, transparent); }
