:root { --hd: #ff6600; --hd-dk: #cc4400; }

/* ── Location picker ── */
.loc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.loc-btn {
    border: 3px solid var(--hd); border-radius: 16px;
    padding: 28px 16px; cursor: pointer; background: #fff; text-align: center;
    transition: all .2s; font-family: inherit; width: 100%;
    display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.loc-btn:hover  { background: #fff3e0; transform: scale(1.02); box-shadow: 0 4px 16px rgba(255,102,0,.25); }
.loc-btn:active { transform: scale(.97); }
.loc-btn.sel    { background: var(--hd); border-color: var(--hd-dk); }
.loc-btn.sel .loc-num, .loc-btn.sel .loc-label { color: #fff !important; }
.loc-num   { font-size: 2.8rem; font-weight: 900; color: var(--hd); line-height: 1; }
.loc-label { font-size: .95rem; font-weight: 700; color: #555; }

/* ── Part scan slots ── */
.part-slot {
    display: flex; align-items: center; gap: 10px;
    padding: 8px 14px; border-radius: 12px;
    border: 2px solid #dee2e6; background: #f8f9fa;
    margin-bottom: 8px; transition: all .2s;
}
.part-slot.is-active { border-color: var(--hd); background: #fff8f3; }
.part-slot.is-filled { border-color: #28a745; background: #f0fff4; }
.part-slot .sn { font-size: 1.1rem; font-weight: 800; color: #bbb; min-width: 22px; text-align: center; }
.part-slot.is-active .sn { color: var(--hd); }
.part-slot.is-filled .sn { color: #28a745; }

/* ── Buffer grid ── */
.buf-row { margin-bottom: 6px; }
.buf-row-label {
    font-weight: 900; font-size: 1rem; color: #fff;
    background: #343a40; border-radius: 6px 0 0 6px;
    padding: 4px 10px; text-align: center; min-width: 32px;
    display: inline-flex; align-items: center; justify-content: center;
}
.buf-cells {
    display: grid; grid-template-columns: repeat(15, 1fr); gap: 3px;
}
.buf-cell {
    min-height: 72px; border-radius: 6px;
    border: 2px solid #e0e0e0; background: #f5f5f5;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: .6rem; text-align: center; padding: 3px 2px;
    cursor: default; transition: all .2s; overflow: hidden;
    position: relative;
}
.buf-cell.used { background: #e3f2fd; border-color: #1976d2; cursor: pointer; }
.buf-cell.used:hover { transform: scale(1.12); box-shadow: 0 4px 16px rgba(25,118,210,.35); z-index: 10; position: relative; }
.buf-cell .cid { font-weight: 800; font-size: .68rem; color: #1565c0; font-family: monospace; display: block; }
.buf-cell .cpt { font-size: .56rem; color: #555; line-height: 1.3; display: block; word-break: break-all; }
.buf-cell .cfi { font-size: .5rem; color: #90a4ae; display: block; margin-top: 2px; }
.buf-cell.empty-cell { opacity: .3; }
.slot-lbl { font-size: .48rem; color: #ccc; display: block; position: absolute; top: 2px; right: 3px; }

/* ── Pallet cards (Line Return) ── */
.pallet-card {
    border: 2px solid #dee2e6; border-radius: 14px; padding: 14px 16px;
    margin-bottom: 10px; background: #fff; cursor: pointer;
    transition: all .2s; display: flex; justify-content: space-between; align-items: center;
}
.pallet-card:hover  { border-color: var(--hd); box-shadow: 0 2px 10px rgba(255,102,0,.2); transform: scale(1.01); }
.pallet-card.sel    { border-color: var(--hd); background: #fff8f3; }

/* ── Stat cards ── */
.stat-card { text-align: center; padding: 16px 12px; border-radius: 14px; }
.stat-num   { font-size: 2.4rem; font-weight: 900; line-height: 1; }
.stat-lbl   { font-size: .78rem; font-weight: 700; text-transform: uppercase; color: #888; margin-top: 4px; }

/* ── Line selector ── */
.line-sel {
    border: 3px solid #dee2e6; border-radius: 14px;
    padding: 20px 16px; cursor: pointer; background: #fff; text-align: center;
    transition: all .2s; font-family: inherit; font-size: 1.3rem; font-weight: 800; color: #555;
}
.line-sel:hover  { border-color: #aaa; background: #f8f9fa; transform: scale(1.02); }
.line-sel.sel-l1 { border-color: #28a745; background: #f0fff4; color: #155724; }
.line-sel.sel-l2 { border-color: #007bff; background: #e8f4fd; color: #004085; }

/* ── PDA responsive ── */
@media (max-width: 767px) {
    .pda-input { font-size: 1.5rem !important; height: 68px !important; }
    .loc-btn   { min-height: 110px; }
    .line-sel  { padding: 14px 10px; }
}