/* =========================================
   Sokolink - Barcode Display
   ========================================= */

/* Barcode input row — inline barcode scanner field */
.barcode-input-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.barcode-input-row input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid var(--color-gray-200);
    border-radius: var(--border-radius, 6px);
    font-family: var(--font-mono);
    font-size: var(--text-sm);
}

.barcode-input-row .btn {
    flex-shrink: 0;
}

.barcode-cell {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}

.barcode-cell svg {
    max-height: 32px;
    width: auto;
}

.barcode-value {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-gray-500);
}

/* Barcode preview inside product form modal */
.barcode-preview {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px;
    background: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--border-radius);
    margin-top: 8px;
}

.barcode-preview svg {
    max-height: 56px;
    width: auto;
}

.barcode-preview-label {
    font-family: var(--font-mono);
    font-size: var(--text-xs);
    color: var(--color-gray-500);
    margin-top: 4px;
}