/* Flat Tray Index - Appily-OneHundredSix orders
 Nursery flat chrome wraps season-log sheets (.lg-sheet, .lg-drip*, lg-go).
 NOT Procession Ledger lamps or Chrono Pulse. */

.page-a106-flattray { overflow-x: clip; }

.ft-stage { padding-bottom: var(--a106-space-6); }

.ft-mast {
 display: flex;
 flex-wrap: wrap;
 align-items: flex-end;
 justify-content: space-between;
 gap: 16px;
 padding: clamp(28px, 4vw, 48px) 0 18px;
}
.ft-kicker {
 margin: 0 0 8px;
 font-size: 0.78rem;
 font-weight: 800;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 color: var(--a106-bloom-deep);
}
.ft-mast h1 {
 margin: 0 0 8px;
 font-family: var(--a106-font-display);
 font-size: clamp(1.9rem, 4vw, 2.8rem);
 font-weight: 700;
 color: var(--a106-ink);
}
.ft-mast-copy p {
 margin: 0;
 max-width: 48ch;
 color: var(--a106-mute);
}
.ft-count {
 min-width: 100px;
 padding: 12px 14px;
 text-align: center;
 background: var(--a106-field);
 border: 3px solid var(--a106-soil);
 box-shadow: var(--a106-hard);
}
.ft-count strong {
 display: block;
 font-family: var(--a106-font-display);
 font-size: 1.85rem;
 line-height: 1;
 color: var(--a106-drip-deep);
}
.ft-count span {
 font-size: 0.7rem;
 font-weight: 800;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--a106-mute);
}

.ft-body { display: grid; gap: 20px; }

.ft-loading {
 padding: 28px 18px;
 text-align: center;
 font-weight: 700;
 color: var(--a106-mute);
 background: var(--a106-surface);
 border: 3px dashed var(--a106-border);
}

.ft-plane {
 padding: 28px 20px;
 text-align: center;
 background: var(--a106-surface);
 border: 3px solid var(--a106-soil);
 box-shadow: var(--a106-hard-sm);
}
.ft-plane h2 {
 margin: 0 0 8px;
 font-family: var(--a106-font-display);
 font-size: 1.45rem;
}
.ft-plane p {
 margin: 0 0 16px;
 color: var(--a106-mute);
}
.ft-plane-actions {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 14px;
 align-items: center;
}

/* Tray frame */
.ft-tray-frame {
 position: relative;
 padding: 16px 14px 20px;
 background:
 radial-gradient(circle at 20% 30%, rgba(198, 245, 66, 0.12), transparent 40%),
 linear-gradient(165deg, #d8c49a 0%, #c4ad7e 55%, #b89a68 100%);
 border: 4px solid var(--a106-soil);
 box-shadow: inset 0 0 0 6px rgba(42, 33, 24, 0.12), var(--a106-hard);
}
.ft-tray-lip {
 height: 10px;
 margin: -6px -4px 14px;
 background: linear-gradient(180deg, #9a8052, #6e5834);
 border: 2px solid var(--a106-soil);
 border-radius: 2px;
}

.ft-legend {
 display: flex;
 flex-wrap: wrap;
 gap: 10px 14px;
 margin-bottom: 14px;
 padding: 10px 12px;
 background: rgba(238, 246, 241, 0.85);
 border: 2px solid var(--a106-soil);
}
.ft-leg {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 font-size: 0.78rem;
 font-weight: 800;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: var(--a106-mute);
}
.ft-leg i {
 width: 12px;
 height: 12px;
 border: 2px solid var(--a106-soil);
 display: inline-block;
}
.ft-leg--drip i { background: var(--a106-drip); }
.ft-leg--clay i { background: var(--a106-clay); }
.ft-leg--sprout i { background: var(--a106-sprout); }
.ft-leg--bloom i { background: var(--a106-bloom); }

.ft-log-head {
 margin-bottom: 14px;
}
.ft-log-head h2 {
 margin: 0 0 4px;
 font-family: var(--a106-font-display);
 font-size: 1.2rem;
 color: var(--a106-soil);
}
.ft-log-head p {
 margin: 0;
 font-size: 0.88rem;
 color: rgba(42, 33, 24, 0.78);
}

/* Cell grid hosts season-log articles */
.ft-cells.lg-list {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
 gap: 14px;
}
.ft-cells.lg-list.is-empty {
 min-height: 0;
}
.ft-cells.lg-list.is-set .lg-sheet {
 animation: ft-cell-in 0.4s var(--a106-ease) both;
 animation-delay: calc(var(--lg-i, 0) * 0.05s);
}

@keyframes ft-cell-in {
 from {
 opacity: 0;
 transform: translateY(10px) scale(0.98);
 }
 to {
 opacity: 1;
 transform: none;
 }
}
@media (prefers-reduced-motion: reduce) {
 .ft-cells.lg-list.is-set .lg-sheet { animation: none; }
}

/* Season-log sheet restyled as tray cell */
.lg-sheet {
 display: flex;
 flex-direction: column;
 margin: 0;
 background: var(--a106-field);
 border: 3px solid var(--a106-soil);
 box-shadow: 3px 3px 0 rgba(42, 33, 24, 0.2);
 overflow: hidden;
}
.lg-datehead {
 display: grid;
 grid-template-columns: auto 1fr auto;
 gap: 8px;
 align-items: center;
 padding: 10px 12px;
 background: var(--a106-soil);
 color: var(--a106-on-soil);
}
.lg-dateblock {
 display: grid;
 justify-items: center;
 min-width: 48px;
 padding: 4px 6px;
 background: var(--a106-kraft);
 color: var(--a106-soil);
 border: 2px solid var(--a106-kraft-deep);
 line-height: 1.1;
}
.lg-day {
 font-family: var(--a106-font-display);
 font-size: 1.25rem;
 font-weight: 700;
}
.lg-mon,
.lg-yr {
 font-size: 0.65rem;
 font-weight: 800;
 letter-spacing: 0.06em;
 text-transform: uppercase;
}
.lg-season {
 font-size: 0.68rem;
 font-weight: 800;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--a106-sprout);
}
.lg-status {
 font-size: 0.72rem;
 font-weight: 800;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: var(--a106-kraft);
}
.lg-sheet.tone-cancelled .lg-status { color: var(--a106-bloom); }
.lg-sheet.tone-delivered .lg-status { color: var(--a106-sprout); }

.lg-sheet-body {
 display: grid;
 gap: 10px;
 padding: 14px 12px 12px;
 flex: 1;
}
.lg-id {
 margin: 0;
 font-family: var(--a106-font-display);
 font-size: 1.15rem;
 font-weight: 700;
 color: var(--a106-ink);
 word-break: break-word;
}
.lg-meta {
 margin: 0;
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 8px;
}
.lg-meta div {
 padding: 8px;
 background: rgba(232, 212, 168, 0.35);
 border: 2px solid var(--a106-border);
}
.lg-meta dt {
 margin: 0 0 2px;
 font-size: 0.65rem;
 font-weight: 800;
 letter-spacing: 0.1em;
 text-transform: uppercase;
 color: var(--a106-mute);
}
.lg-meta dd {
 margin: 0;
 font-weight: 800;
 font-size: 0.92rem;
}
.lg-items {
 margin: 0;
 font-size: 0.86rem;
 color: var(--a106-mute);
 line-height: 1.4;
}

.lg-drips {
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 gap: 4px;
}
.lg-drip {
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 4px;
 opacity: 0.35;
}
.lg-drip i {
 display: block;
 width: 100%;
 height: 8px;
 border: 2px solid var(--a106-soil);
 background: var(--a106-border);
}
.lg-drip small {
 font-size: 0.58rem;
 font-weight: 800;
 letter-spacing: 0.02em;
 text-transform: uppercase;
 color: var(--a106-mute);
 text-align: center;
}
.lg-drip.is-done,
.lg-drip.is-live { opacity: 1; }
.lg-drip--drip.is-done i,
.lg-drip--drip.is-live i { background: var(--a106-drip); }
.lg-drip--clay.is-done i,
.lg-drip--clay.is-live i { background: var(--a106-clay); }
.lg-drip--sprout.is-done i,
.lg-drip--sprout.is-live i { background: var(--a106-sprout); }
.lg-drip--bloom.is-done i,
.lg-drip--bloom.is-live i { background: var(--a106-bloom); }
.lg-drip.is-live i {
 animation: ft-drip-pulse 1.3s ease-in-out infinite;
}
.lg-drip.is-void {
 opacity: 0.25;
 filter: grayscale(1);
}
@keyframes ft-drip-pulse {
 0%, 100% { transform: scaleY(1); }
 50% { transform: scaleY(1.35); }
}
@media (prefers-reduced-motion: reduce) {
 .lg-drip.is-live i { animation: none; }
}

a.lg-go {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 40px;
 padding: 0 12px;
 background: var(--a106-drip);
 color: var(--a106-on-drip);
 border: 2px solid var(--a106-soil);
 font-size: 0.82rem;
 font-weight: 800;
 text-decoration: none;
 box-shadow: 2px 2px 0 var(--a106-soil);
}
a.lg-go:hover {
 background: var(--a106-drip-deep);
 color: var(--a106-on-drip);
}

.lg-print-row {
 padding: 0 12px 12px;
}
.lg-print {
 width: 100%;
 min-height: 38px;
 border: 2px dashed var(--a106-soil);
 background: transparent;
 font-weight: 800;
 font-size: 0.78rem;
 letter-spacing: 0.06em;
 text-transform: uppercase;
 color: var(--a106-mute);
}
.lg-print:hover,
.lg-print.is-pressing {
 background: var(--a106-kraft);
 color: var(--a106-soil);
 border-style: solid;
}

.ft-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 min-height: 48px;
 padding: 0 18px;
 border: 3px solid var(--a106-soil);
 font-weight: 800;
 text-decoration: none;
 box-shadow: var(--a106-hard-sm);
}
.ft-btn--primary {
 background: var(--a106-drip);
 color: var(--a106-on-drip);
}
.ft-text-exit {
 font-weight: 700;
 color: var(--a106-drip-deep);
}

.ft-trail {
 display: flex;
 flex-wrap: wrap;
 gap: 12px 18px;
 padding-top: 4px;
 border-top: 2px dashed var(--a106-border);
}
.ft-trail a {
 font-size: 0.88rem;
 font-weight: 700;
 text-decoration: none;
 color: var(--a106-mute);
}
.ft-trail a:hover { color: var(--a106-clay); }

@media (max-width: 640px) {
 .lg-drips {
 grid-template-columns: repeat(2, 1fr);
 }
 .ft-plane-actions {
 flex-direction: column;
 align-items: stretch;
 }
 .ft-plane-actions .ft-btn,
 .ft-trail a {
 width: 100%;
 text-align: center;
 }
 .ft-trail {
 flex-direction: column;
 }
}

@media (max-width: 560px) {
 .lg-meta {
 grid-template-columns: 1fr;
 }
 .lg-datehead {
 grid-template-columns: 1fr;
 justify-items: start;
 gap: 6px;
 }
 .lg-dateblock {
 justify-self: start;
 }
}
