﻿/* ヘッダ部分 */
input#CustomerCode {
    min-width: 10ch;
    max-width: 10ch;
}

input#StoreCode {
    min-width: 8ch;
    max-width: 8ch;
}

input#DeliveryDate {
    max-width: 20ch;
}

span#CustomerName {
    min-width: 24ch;
    max-width: 24ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
select#VendorCode {
    min-width: 16ch;
    max-width: 20ch;
}

span#StoreName {
    min-width: 15ch;
    max-width: 20ch;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* 明細部分 */

root {
    --w-no: 4rem;
    --w-itemcode: 22ch;
    --w-code: 5ch;
    --w-name: 30ch;
    --w-spec: 10ch;
    --w-dept: 6ch;
    --w-entryqty: 6ch;
    --w-unit: 8ch;
    --w-case: 8ch;
    --w-piece: 8ch;
    --w-total: 8ch;
    --w-price: 8ch;
    --w-custprice: 8ch;
    --w-op: 8ch;
}
/* 各列幅固定 */
.w-no {
    min-width: var(--w-no);
    max-width: var(--w-no);
}

.w-itemcode {
    min-width: var(--w-itemcode);
    max-width: var(--w-itemcode);
}

.w-code {
    min-width: var(--w-code);
    max-width: var(--w-code);
}

.w-name {
    min-width: var(--w-name);
    max-width: var(--w-name);
}

.w-spec {
    min-width: var(--w-spec);
    max-width: var(--w-spec);
}

.w-dept {
    min-width: var(--w-dept);
    max-width: var(--w-dept);
}

.w-entryqty {
    min-width: var(--w-entryqty);
    max-width: var(--w-entryqty);
    text-align: right;
}

.w-unit {
    min-width: var(--w-unit);
    max-width: var(--w-unit);
}

.w-case {
    min-width: var(--w-case);
    max-width: var(--w-case);
}

.w-piece {
    min-width: var(--w-piece);
    max-width: var(--w-piece);
}

.w-total {
    min-width: var(--w-total);
    max-width: var(--w-total);
}

.w-price {
    min-width: var(--w-price);
    max-width: var(--w-price);
}

.w-custprice {
    min-width: var(--w-custprice);
    max-width: var(--w-custprice);
}

.w-op {
    min-width: var(--w-op);
    max-width: var(--w-op);
}
/* 各列幅固定 */
.w-no {
    min-width: var(--w-no);
    max-width: var(--w-no);
}

.w-itemcode {
    min-width: var(--w-itemcode);
    max-width: var(--w-itemcode);
}

.w-code {
    min-width: var(--w-code);
    max-width: var(--w-code);
}

.w-name {
    min-width: var(--w-name);
    max-width: var(--w-name);
}

.w-spec {
    min-width: var(--w-spec);
    max-width: var(--w-spec);
}

.w-dept {
    min-width: var(--w-dept);
    max-width: var(--w-dept);
}

.w-entryqty {
    min-width: var(--w-entryqty);
    max-width: var(--w-entryqty);
}

.w-unit {
    min-width: var(--w-unit);
    max-width: var(--w-unit);
}

.w-case {
    min-width: var(--w-case);
    max-width: var(--w-case);
}

.w-piece {
    min-width: var(--w-piece);
    max-width: var(--w-piece);
}

.w-total {
    min-width: var(--w-total);
    max-width: var(--w-total);
}

.w-price {
    min-width: var(--w-price);
    max-width: var(--w-price);
}

.w-custprice {
    min-width: var(--w-custprice);
    max-width: var(--w-custprice);
}

.w-op {
    min-width: var(--w-op);
    max-width: var(--w-op);
}

/* 入力欄はセルにフィット */
.w-itemcode input,
.w-name input,
.w-spec input,
.w-dept input,
.w-entryqty input,
.w-unit input,
.w-case input,
.w-piece input,
.w-total input,
.w-price input,
.w-custprice input {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.w-code input {
    min-width: 8ch;
    max-width: 8ch;
}
.table-scroll-x {
    overflow-x: auto;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
}

.nowrap th, .nowrap td {
    white-space: nowrap;
}



.mono {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.entry-wrapper {
    padding: .5rem;
}

.compact-block {
    margin-bottom: .5rem;
}

.cell-stack {
    display: grid;
    grid-auto-rows: minmax(1.2rem, auto);
    row-gap: .15rem;
}

.cell-line {
    display: flex;
    align-items: baseline;
    column-gap: .4rem;
    min-height: 1.2em;
}

.cell-label {
    font-weight: 700;
    color: #555;
}
/* 「仕入先」「産地」などのラベル */
.cell-subtle {
    color: #6c757d;
    font-size: .8em;
}