/* BONE_KASIR_MARKETOP_UI_V5_8_LIST_FONT_SETTINGS_CSS */
html {
    --bone-kasir-list-font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bone-kasir-list-name-size: 18px;
    --bone-kasir-list-meta-size: 13px;
    --bone-kasir-list-number-size: 16px;
    --bone-kasir-list-amount-size: 21px;
    --bone-kasir-list-row-pad-y: 14px;
    --bone-kasir-list-control-size: 16px;
    --bone-kasir-list-control-height: 52px;
    --bone-kasir-list-button-height: 50px;
    --bone-kasir-list-line-height: 1.22;
}

/* Pengaturan ini khusus area daftar item/keranjang, tidak membesarkan seluruh halaman. */
html body .kasir-cart-scroll,
html body .kasir-cart-scroll .kasir-table,
html body .kasir-cart-scroll .kasir-table tbody,
html body .kasir-cart-scroll .kasir-table tbody td,
html body .kasir-cart-scroll .kasir-table tbody td *,
html body .kasir-cart-scroll .kasir-item-name,
html body .kasir-cart-scroll .kasir-code,
html body .kasir-cart-scroll .kasir-price,
html body .kasir-cart-scroll .kasir-amount,
html body .kasir-cart-scroll .kasir-row-input,
html body .kasir-cart-scroll .kasir-select,
html body .kasir-cart-scroll [class*="tabular-nums"] {
    font-family: var(--bone-kasir-list-font-family) !important;
}

html body .kasir-cart-scroll .kasir-table tbody td {
    padding-top: var(--bone-kasir-list-row-pad-y) !important;
    padding-bottom: var(--bone-kasir-list-row-pad-y) !important;
    font-size: var(--bone-kasir-list-number-size) !important;
    line-height: var(--bone-kasir-list-line-height) !important;
}
html body .kasir-cart-scroll .kasir-table tbody td:first-child,
html body .kasir-cart-scroll .kasir-code,
html body .kasir-cart-scroll .text-xs {
    font-size: var(--bone-kasir-list-meta-size) !important;
    line-height: 1.25 !important;
}
html body .kasir-cart-scroll .kasir-item-name,
html body .kasir-cart-scroll .font-black.text-slate-950,
html body .kasir-cart-scroll [data-kasir-item-name] {
    font-size: var(--bone-kasir-list-name-size) !important;
    line-height: var(--bone-kasir-list-line-height) !important;
    letter-spacing: -0.01em !important;
}
html body .kasir-cart-scroll .kasir-price,
html body .kasir-cart-scroll .kasir-table tbody td:nth-last-child(2),
html body .kasir-cart-scroll .kasir-table tbody td:nth-last-child(3),
html body .kasir-cart-scroll [class*="tabular-nums"] {
    font-size: var(--bone-kasir-list-number-size) !important;
    font-variant-numeric: tabular-nums !important;
}
html body .kasir-cart-scroll .kasir-amount,
html body .kasir-cart-scroll .kasir-table tbody td:last-child,
html body .kasir-cart-scroll .text-right.font-black {
    font-size: var(--bone-kasir-list-amount-size) !important;
    line-height: 1.1 !important;
    font-variant-numeric: tabular-nums !important;
}
html body .kasir-cart-scroll .kasir-row-input,
html body .kasir-cart-scroll .kasir-select,
html body .kasir-cart-scroll input,
html body .kasir-cart-scroll select {
    min-height: var(--bone-kasir-list-control-height) !important;
    font-size: var(--bone-kasir-list-control-size) !important;
    line-height: 1.15 !important;
}
html body .kasir-cart-scroll button,
html body .kasir-cart-scroll .kasir-btn {
    min-height: var(--bone-kasir-list-button-height) !important;
    font-size: var(--bone-kasir-list-control-size) !important;
}

/* Hasil cari item manual ikut preferensi agar operator yang matanya butuh besar tetap nyaman. */
html body .fixed:has(#inputCariItem) table tbody td {
    padding-top: var(--bone-kasir-list-row-pad-y) !important;
    padding-bottom: var(--bone-kasir-list-row-pad-y) !important;
    font-family: var(--bone-kasir-list-font-family) !important;
    font-size: var(--bone-kasir-list-number-size) !important;
    line-height: var(--bone-kasir-list-line-height) !important;
}
html body .fixed:has(#inputCariItem) table tbody td div.font-black,
html body .fixed:has(#inputCariItem) table tbody td:nth-child(2) > div:first-child {
    font-family: var(--bone-kasir-list-font-family) !important;
    font-size: var(--bone-kasir-list-name-size) !important;
    line-height: var(--bone-kasir-list-line-height) !important;
}
html body .fixed:has(#inputCariItem) table tbody td.text-right,
html body .fixed:has(#inputCariItem) table tbody td .tabular-nums {
    font-family: var(--bone-kasir-list-font-family) !important;
    font-size: var(--bone-kasir-list-number-size) !important;
    font-variant-numeric: tabular-nums !important;
}

.bone-kasir-list-settings-v5-8 {
    border-color: rgba(56, 189, 248, .24) !important;
    background:
        radial-gradient(circle at top left, rgba(14, 165, 233, .16), transparent 34%),
        rgba(15, 23, 42, .70) !important;
}
.bone-kasir-font-grid-v5-8 {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
}
.bone-kasir-font-btn-v5-8,
.bone-kasir-font-step-v5-8,
.bone-kasir-font-reset-v5-8 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 58px !important;
    border-radius: 18px !important;
    border: 1px solid rgba(148, 163, 184, .25) !important;
    background: rgba(15, 23, 42, .72) !important;
    color: #e5f6ff !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
    font-weight: 1000 !important;
    line-height: 1.15 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
    cursor: pointer !important;
}
.bone-kasir-font-btn-v5-8 small {
    display: block !important;
    margin-top: 4px !important;
    color: #93c5fd !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}
.bone-kasir-font-btn-v5-8.is-active {
    border-color: rgba(45, 212, 191, .78) !important;
    background: linear-gradient(135deg, rgba(20,184,166,.95), rgba(37,99,235,.95)) !important;
    color: #ffffff !important;
}
.bone-kasir-font-btn-v5-8.is-active small { color: rgba(255,255,255,.82) !important; }
.bone-kasir-font-row-v5-8 {
    display: grid !important;
    grid-template-columns: minmax(180px, .8fr) minmax(0, 1.2fr) !important;
    gap: 12px !important;
    align-items: center !important;
    margin-top: 12px !important;
    border-radius: 20px !important;
    border: 1px solid rgba(148, 163, 184, .20) !important;
    background: rgba(2, 6, 23, .28) !important;
    padding: 12px !important;
}
.bone-kasir-font-row-v5-8 label,
.bone-kasir-font-row-title-v5-8 {
    color: #dbeafe !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
}
.bone-kasir-font-select-v5-8 {
    width: 100% !important;
    min-height: 52px !important;
    border-radius: 17px !important;
    border: 1px solid rgba(148, 163, 184, .28) !important;
    background: rgba(15, 23, 42, .84) !important;
    color: #f8fafc !important;
    padding: 0 14px !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    outline: none !important;
}
.bone-kasir-font-adjust-v5-8 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}
.bone-kasir-font-adjust-card-v5-8 {
    border-radius: 18px !important;
    border: 1px solid rgba(148, 163, 184, .20) !important;
    background: rgba(15, 23, 42, .55) !important;
    padding: 10px !important;
}
.bone-kasir-font-adjust-card-v5-8 strong {
    display: block !important;
    margin-bottom: 8px !important;
    color: #f8fafc !important;
    font-size: 13px !important;
    font-weight: 1000 !important;
}
.bone-kasir-font-step-grid-v5-8 {
    display: grid !important;
    grid-template-columns: 48px 1fr 48px !important;
    gap: 7px !important;
    align-items: center !important;
}
.bone-kasir-font-step-v5-8 {
    min-height: 46px !important;
    border-radius: 15px !important;
    padding: 0 !important;
    font-size: 20px !important;
}
.bone-kasir-font-value-v5-8 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    border-radius: 15px !important;
    background: rgba(226, 232, 240, .10) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 1000 !important;
    font-variant-numeric: tabular-nums !important;
}
.bone-kasir-font-reset-v5-8 {
    min-height: 52px !important;
    width: 100% !important;
    margin-top: 12px !important;
    background: rgba(244, 63, 94, .16) !important;
    border-color: rgba(251, 113, 133, .36) !important;
    color: #ffe4e6 !important;
}
.bone-kasir-font-note-v5-8 {
    margin-top: 10px !important;
    color: #bfdbfe !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
}

@media (max-width: 1100px) {
    .bone-kasir-font-grid-v5-8 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
    .bone-kasir-font-adjust-v5-8 { grid-template-columns: 1fr !important; }
}
@media (max-width: 680px) {
    .bone-kasir-font-grid-v5-8 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .bone-kasir-font-row-v5-8 { grid-template-columns: 1fr !important; }
    .bone-kasir-font-btn-v5-8 { min-height: 54px !important; font-size: 13px !important; }
}
/* END_BONE_KASIR_MARKETOP_UI_V5_8_LIST_FONT_SETTINGS_CSS */
